<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta charset="UTF-8">
		<title>账单详情</title>
		<meta name="viewport" content="width=device-width, initial-scale=1" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/resource/weixin/css/integralSystem.css" />
		<link rel="stylesheet" href="${pageContext.request.contextPath}/resource/weixin/css/mui.min.css" />
		<script type="text/javascript" src="${pageContext.request.contextPath}/resource/weixin/js/jquery-1.10.2.js" ></script>
		<script type="text/javascript" src="${pageContext.request.contextPath}/resource/weixin/js/integralSystem.js" ></script>
		<script src="/WisdomHome/resource/assets/js/jquery.cookie.js"></script>
		<script src="/WisdomHome/resource/weixin/js/mui.min.js"></script>
	
		
		
		
		
		<style> 
		
 
			.ui-alert {
				text-align: center;
				padding: 20px 10px;
				font-size: 16px;
			}
		</style>
	</head>
	<body >

			
	<div id="main">
			<div id="head" >
				<div class="retreat"><img src="${pageContext.request.contextPath}/resource/weixin/image/retreat.png" class="retreatPicture"/></div>
                <div class="title">账单详情</div>
			</div>
			
			<!--下拉刷新容器-->
				<div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="margin-top: 50px" >
					<div class="mui-scroll">
						<!--数据列表-->
						<div class="mui-table-view mui-table-view-chevron" style="background:none;border-style: none;"></div>
					</div>
				</div>
		
	</div>
	</body>
	
	
	
	<script type="text/javascript">
			Date.prototype.Format = function(fmt)   
			{ 
			  var o = {   
			    "M+" : this.getMonth()+1,                 //月份   
			    "d+" : this.getDate(),                    //日   
			    "h+" : this.getHours(),                   //小时   
			    "m+" : this.getMinutes(),                 //分   
			    "s+" : this.getSeconds(),                 //秒   
			    "q+" : Math.floor((this.getMonth()+3)/3), //季度   
			    "S"  : this.getMilliseconds()             //毫秒   
			  };   
			  if(/(y+)/.test(fmt))   
			    fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));   
			  for(var k in o)   
			    if(new RegExp("("+ k +")").test(fmt))   
			  fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));   
			  return fmt;   
			}  
	
	
			var currentPage = 0;
			var userId = $.cookie("userId");
		
				mui.init({
					pullRefresh: {
						container: '#pullrefresh',
						up: {
							contentrefresh: '正在加载...',
							callback: pullupRefresh
						}
					}
				});
				
				function pullupRefresh() {
					currentPage++;
					$.ajax({
						url:'/WisdomHome/weixin/bill_more',
						type:'post',
						dataType:'json',
						data:{
							userId:userId,
							pageIndex:currentPage
						},
						success:function(data){
		
							if (data == 205) {
								mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
								console.log("user is not exist!");
								return;
							}
							mui('#pullrefresh').pullRefresh().endPullupToRefresh(!data.hasNextPage);
							var div = document.body.querySelector('.mui-table-view');
							var cells = document.body.querySelectorAll('.mui-table-view-cell');
							$.each(data.dataList,function(){
							
							
								var table=document.createElement('table');
								table.setAttribute("class", "billtbinfo");
								var r = table.insertRow(0);
								var c = r.insertCell(0);
								c.setAttribute("rowspan","2");
								c.className="center";
								c.setAttribute("width","15%");
								c.className+=" typeicon";
								if(this.merchant.type==1){
									c.innerHTML='<img src="${pageContext.request.contextPath}/resource/weixin/image/supermarket.png" class="industryicon"/><br/>超市';
									c.style.color="#f6ae40";
								}else if(this.merchant.type==2){
									c.innerHTML='<img src="${pageContext.request.contextPath}/resource/weixin/image/car.png" class="industryicon" /><br/>爱车';
									c.style.color="#fc6f92";
								}else if(this.merchant.type==3){
									c.innerHTML='<img src="${pageContext.request.contextPath}/resource/weixin/image/fruit.png" class="industryicon"/><br/>水果';
									c.style.color="#da3b40";
								}else if(this.merchant.type==4){
									c.innerHTML='<img src="${pageContext.request.contextPath}/resource/weixin/image/train.png" class="industryicon"/><br/>培训';
									c.style.color="#6fc65d";
								}else if(this.merchant.type==5){
									c.innerHTML='<img src="${pageContext.request.contextPath}/resource/weixin/image/glasses.png" class="industryicon"/><br/>眼镜';
									c.style.color="#3fb7f6";
								}else if(this.merchant.type==6){
									c.innerHTML='<img src="${pageContext.request.contextPath}/resource/weixin/image/plane.png" class="industryicon"/><br/>旅游';
									c.style.color="#dc68c2";
								}else if(this.type==20){
									c.innerHTML='<img src="${pageContext.request.contextPath}/resource/weixin/image/other.png" class="industryicon"/><br/>其他';
									c.style.color="#fa684b";
								}
								c=r.insertCell(1);
								c.innerHTML=this.merchant.name;
								c.setAttribute("width","35%");
								c.setAttribute("valign","bottom");
								c=r.insertCell(2);
								c.setAttribute("width","15%");
								c.setAttribute("valign","bottom");
								c.innerHTML='消费';
								c=r.insertCell(3);
								c.setAttribute("width","15%");
								c.setAttribute("valign","bottom");
								c.innerHTML='￥'+this.amount;
								r=table.insertRow(1);
								/*c= r.insertCell(0);
								c.className="center";
								
								if(this.type==1){
									c.innerHTML='超市';
									c.style.color="#f6ae40";
								}else if(this.type==2){
									c.innerHTML='爱车';
									c.style.color="#fc6f92";
								}else if(this.type==3){
									c.innerHTML='水果';
									c.style.color="#da3b40";
								}else if(this.type==4){
									c.innerHTML='培训';
									c.style.color="#6fc65d";
								}else if(this.type==5){
									c.innerHTML='眼镜';
									c.style.color="#3fb7f6";
								}else if(this.type==6){
									c.innerHTML='旅游';
									c.style.color="#dc68c2";
								}*/
								c= r.insertCell(0);

								var date=new Date(this.createdAt);
								date=date.Format("yyyy-MM-dd hh:mm:ss");   
								c.innerHTML=date;
								
								c.className="tbpadd";
								c= r.insertCell(1);	
							
								c.innerHTML="积分";
								c=r.insertCell(2);
									c.innerHTML='+'+this.scores;
								div.appendChild(table);
							});
						},
						error:function(data){
							
						}
					});
				}
				if (mui.os.plus) {
					mui.plusReady(function() {
						setTimeout(function() {
							mui('#pullrefresh').pullRefresh().pullupLoading();
						}, 1000);
		
					});
				} else {
					mui.ready(function() {
					mui('#pullrefresh').pullRefresh().pullupLoading();
					});
				}
				
				/*function showDetail(){
					$("#announceId").val(this.title);
					$("#detailForm").submit();
				}*/

		
				
		</script>
		
</html>
